<template>
  <view class="content">

    <view v-if="gameList.length===0" style="display: flex;flex-direction: row;justify-content: center;color: #d1d0d0;margin-top: 30px">
      <span style="font-size: 20px">暂无</span>
    </view>

    <view v-for="(item, index) in gameList" :key="index" style="padding: 10px">

      <uni-card is-full>
        <view class="swiper-item" @click="toGamePage(item.gameId)">
          <image style="width: 35px;height: 35px;" mode="scaleToFill" src="/static/eight_ball.png"
                 @error="imageError"></image>

          <view style="display: flex;flex-direction: column; justify-items: center;margin-left: 20px;width: 100%">
            <view style="display: flex;flex-direction: row;justify-content: space-between;">
              <span style="color: black;font-weight: bold">{{item.username}}创建的对局</span>
              <uni-tag text="待加入" type="success"/>
            </view>
            <view style="display: flex;flex-direction: row;justify-content: space-between;">
              <span>中式八球</span>
              <span style="color: #cccaca">{{ item.createTime }}</span>
            </view>
          </view>

        </view>
      </uni-card>


    </view>

    <uni-popup ref="alertDialog" type="dialog">
      <uni-popup-dialog type="info" confirmText="去登录" title="提示" content="您需要登录才能完成此操作"
                        @confirm="dialogConfirm"
      ></uni-popup-dialog>
    </uni-popup>

  </view>
</template>

<script>
import gameService from "../../../api/game";

export default {
  data() {
    return {
      memberInfo: this.$store.state,
      gameList: [],
      url:''
    }
  },
  onLoad() {
  },
  onShow() {
    this.list()
  },
  methods: {
    dialogConfirm() {
      uni.navigateTo({
        url: '/pages/my/login/index?page=' + this.url
      });
    },
    toGamePage(gameId) {
      this.url = '/pages/game/index?gameId=' + gameId + '&preView=true'
      if (this.memberInfo.memberId === undefined || this.memberInfo.memberId === '') {
        this.$refs.alertDialog.open()
      }else{
        uni.navigateTo({
          url: this.url
        });
      }

    },
    list() {
      gameService.list("0").then(res => {
        this.gameList = res.data.data
      })
    }
  }
}
</script>

<style lang="scss">

.swiper-item {
  display: flex;
  flex-direction: row;
  align-items: center;

}
</style>
